<template>
	<u-navbar :title="title" :background="{background:background}" :title-color="titleColor" :is-back="isBack"
		:border-bottom="borderBottom" :custom-back="customBack">
		<view class="navbar-content flex-center-between">
			<view>
				<slot name="left"></slot>
			</view>
			<view>
				<slot name="middle"></slot>
			</view>
			<view>
				<slot name="right"></slot>
			</view>
		</view>
	</u-navbar>
</template>

<script>
	export default {
		props: {
			// 标题
			title: {
				type: String,
				default: '',
			},
			// navbar背景颜色
			background: {
				type: String,
				default: "#bbd8fd",
			},
			// 标题文字颜色
			titleColor: {
				type: String,
				default: "#000000",
			},
			// 导航栏标题字体大小，单位 rpx，1.5.5起由 32 调整为 44
			titleSize: {
				type: Number,
				default: 32,
			},
			// 是否展示左侧【返回】
			isBack: {
				type: Boolean,
				default: true,
			},
			// 是否展示底部线条
			borderBottom: {
				type: Boolean,
				default: false,
			},
			// 自定义返回逻辑方法，如传入，点击返回按钮执行函数，否则正常返回上一页，注意模板中不需要写方法参数的括号 :customBack="()=>{}"
			customBack: {
				type: Function
			}
		},
		data() {
			return {}
		},
		// 加载
		onLoad() {},
		methods: {}
	}
</script>

<style scoped lang="less">
	.navbar-content {
		width: 100%;
		height: 100%;
		padding: 0 3%;
	}
</style>